<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>分页插件演示</title>
    <link rel="stylesheet" href="../css/pagination.css">
    <script src="../js/jquery-1.10.1.min.js"></script>
    <script src="../js/jquery.pagination.js"></script>
    <style>
        * {
            padding: 0;
            margin: 0;
        }

        a {
            color: inherit;
            text-decoration: none;
        }

        #box {
            margin: 100px;
        }

        .myActive {
            background-color: #6ff;
        }

        #box .prev,
        #box .next {
            width: auto;
        }
    </style>
</head>

<body>
    <div id="box" class="m-style"></div>
</body>
<script>
    $("#box").pagination({
        // pageCount: 5,        // maxPage 最大页码  (如果已知totalData 和 showData 不写也可以)
        totalData: 100,    //总数据
        showData: 10,    // 每页显示多少条
        mode: "fixed",   // 页码固定
        count: 4,        // 显示多少页码  (n-1)
        current: 3,      //当前第几页  (默认显示第三页)
        // activeCls: "myActive",

        // isHide: true,    // 总页数为0或1时隐藏分页控件

        // 定义上一页  和 下一页的内容
        prevContent: "上一页",
        nextContent: "下一页",

        //开启首页和尾页 
        coping: true,   // 是否开启首页和末页
        homePage: "首页",  // 按钮的内容
        endPage: "尾页",   // 按钮的内容

        // 开启跳转
        jump: true,  // 是否开启跳转到指定页数
        jumpBtn: "go",  // 跳转按钮的内容

        // 回调函数  (页码切换的时候触发)
        callback: function (api) {   // api 其实是分页插件创建的实例化对象
            // getPageCount()	    无	        获取总页数
            // setPageCount(page)	page：页数	设置总页数
            // getCurrent()	        无	        获取当前页
            // console.log(api);
            // console.log(api.getPageCount());
            // api.setPageCount(20)
            console.log(api.getCurrent());

        }


    })

</script>

</html>